﻿<h2 class="title center-aligned">Pick a carrier</h2>

<div class="request-page page-center">

    <div class="sort-picker">
        <span>Order by:</span>
        <select class="order-picker" data-bind="value: sortType">
            <option value="0">Default</option>
            <option value="1">Rank</option>
        </select>
    </div>
    <ul class="carrier-list list" data-bind="foreach: { data: carriers, as: 'carrier' }">
        <li class="carrier" data-bind="event: { click: $root.ExpandCarrier.bind($root) }">
            <a class="carrier-name" data-bind="text: carrier.Name"></a>
            <a class="carrier-rank" data-bind="text: carrier.Rank"></a>
            <span class="chevron"></span>
        </li>
    </ul>

    <button class="btn more" data-bind="click: MoreCarriersClickEvent">More</button>



</div>
